<template>
	<view class="main">
		<view class="form-box">
			<van-cell-group inset>
				<view class="form-title">
					<van-field v-model="form.flSubject" label="会议标题" readonly label-align="top" />
				</view>
			</van-cell-group>
			<van-cell-group inset style="margin-top: 10px;">
				<van-field v-model="form.startTime" readonly name="datePicker" label="会议开始时间" input-align="right" />
				<van-field v-model="form.endTime" readonly name="datePicker" label="会议结束时间" input-align="right" />
				<van-field v-model="form.meetPlace" readonly name="picker" label="会议室" input-align="right" />
				<van-field v-model="form.meetingNum" readonly label="参会人数" input-align="right" />
				<van-field v-model="form.remark" readonly label="备注" input-align="right" />
			</van-cell-group>
			<van-cell-group inset style="margin-top: 10px;">
				<van-field readonly label="附件:" input-align="right" />
				<view style="display: flex;justify-content: space-between;padding: 10px 16px;align-items: center;" v-for="item, index in fileList" :key="index">
					<!-- <van-field class="fujian" readonly :label="item.fileName" input-align="right">
						 <van-button @click="downloadFile(item.filePath, item.fileName)" slot="button" size="small" plain hairline type="info">
							 <image src="/static/docmumentImg/ic-dowload.png" class="ic-dowload"/>
						 </van-button>
					</van-field> -->

					<view class="fr-row">
						<!-- 根据it.extName 显示下面对应个图片和图标 如果是pdf就显示pdf的-->
						<image src="/static/docmumentImg/ico-pdf.png" class="fileico-img" v-if="isFileOfType(item.fileName, 'pdf')">
						</image>
						<image src="/static/docmumentImg/ico-world.png" class="fileico-img"
							v-else-if="isFileOfType(item.fileName, 'document')"></image>
						<image src="/static/docmumentImg/ic-img.png" class="ic-imgxz"
							v-else-if="isFileOfType(item.fileName, 'image')"></image>
						<!-- <uv-icon name="folder" class="fileico-down" size="25" color="#2D75D7" v-else></uv-icon> -->
						<text class="file-name" style="margin-left: 13px;line-height: 26px;font-size: 14px;">{{ item.fileName }}</text>
						<!-- <text class="file-size">{{ item.fileSize }}</text> -->
					</view>
					<image src="/static/docmumentImg/ic-dowload.png" class="ic-dowload"
						@click="downloadFile(item.filePath, item.fileName)"></image>
				</view>
			</van-cell-group>
			<van-cell-group inset style="margin-top: 10px;">
				<van-field v-model="form.flCreateDept" readonly label="承办部门" input-align="right" />
				<van-field v-model="form.flCreateDate" readonly label="申请时间" input-align="right" />
				<van-field v-model="form.flCreator" readonly label="承办人" input-align="right" />
				<van-field v-model="form.flCreatorPhone" readonly label="联系电话" input-align="right" />
			</van-cell-group>
		</view>
	</view>
</template>

<script>
	import {
		hyapInfo
	} from '../../../api'
	export default {
		data() {
			return {
				id: '',
				form: {},
				fileList: []
			}
		},
		onLoad(e) {
			this.id = e.id
			this.init()
		},
		methods: {
			isFileOfType(ext, type) {
				const normalizedExt = ext.split('.')[1]
				console.log(normalizedExt);
				// const normalizedExt = String(ext).toLowerCase().replace(/^\./, '');

				// 定义各种文件类型对应的扩展名集合
				const fileTypes = {
					pdf: ['pdf'],
					document: ['doc', 'docx', 'xls', 'xlsx', 'ppt', 'pptx', 'txt', 'rtf'],
					image: ['jpg', 'jpeg', 'png', 'gif', 'bmp', 'webp', 'svg']
				};

				// 如果 type 是预定义类型名，使用对应的扩展名集合
				if (fileTypes[type]) {
					return fileTypes[type].includes(normalizedExt);
				}

				// 如果 type 是扩展名数组，直接检查
				if (Array.isArray(type)) {
					return type.includes(normalizedExt);
				}

				// 如果 type 是单个扩展名，直接比较
				return normalizedExt === type;
			},
			init() {
				hyapInfo(this.id).then(res => {
					this.form = res.data.data
					this.fileList = res.data.data.hyglAttachList
					console.log('form', this.form)
				})
			},
			// 下载文件
			downloadFile(url, fileName) {
				// uni.showLoading({
				// 	title: '下载中...',
				// 	mask: true
				// });

				uni.downloadFile({
					url: url, // 下载地址
					success: (res) => {
						if (res.data.statusCode === 200) {
							// 保存文件（仅App平台支持）
							if (uni.getSystemInfoSync().platform === 'app-plus') {
								saveFile(res.tempFilePath, fileName);
							} else {
								// 非App平台可直接预览
								uni.previewImage({
									urls: [res.tempFilePath],
									current: res.tempFilePath
								});
							}
						} else {
							uni.showToast({
								title: '下载失败',
								icon: 'none'
							});
						}
					},
					fail: (err) => {
						console.error('下载失败:', err);
						uni.showToast({
							title: '下载失败，请重试',
							icon: 'none'
						});
					},
					complete: () => {
						uni.hideLoading();
					}
				});
			},

			// App平台保存文件到本地（需添加文件存储权限）
			saveFile(tempFilePath, fileName) {
				uni.getProvider({
					service: 'saveFile',
					success: () => {
						uni.saveFile({
							tempFilePath: tempFilePath,
							success: (res) => {
								uni.showToast({
									title: '下载成功',
									icon: 'success'
								});
								console.log('文件保存路径:', res.savedFilePath);
							},
							fail: (err) => {
								console.error('保存失败:', err);
								uni.showToast({
									title: '保存失败，请重试',
									icon: 'none'
								});
							}
						});
					},
					fail: (err) => {
						console.error('不支持保存文件:', err);
					}
				});
			}
		}
	}
</script>

<style lang="scss" scoped>
	.fr-row {
		display: flex;
	}

	.fileico-img,
	.ic-imgxz,
	.ic-dowload {
		width: 26px !important;
		height: 26px;
	}

	.main {
		background-color: #f5f5f5;
		min-height: 100vh;
	}

	.form-box {
		position: relative;
		top: 0;
		left: 0;
		width: 100%;
		padding-top: 10px;
		margin-bottom: 50rpx;
		border-bottom: 0;
		min-height: 0;
	}

	.form-title {
		::v-deep .van-field__control {
			font-weight: 800;
			font-size: 15px;
			color: #555555;
		}

		::v-deep .van-cell {
			flex-direction: column;
		}

		::v-deep .van-field__body {
			border-bottom: 1px solid #efefef;
			margin-top: 10px;
		}
	}

	.fujian {
		::v-deep .van-field__label {
			width: 16.2em;
			color: #323232
		}
	}
</style>